import { Component } from 'react'
import { connect } from 'react-redux';
import { Dispatch } from 'redux';
import { View,ScrollView} from '@tarojs/components'
import Taro from '@tarojs/taro'
import './index.less'
import { setData } from '@/store/actions/app';
interface props {
   [propkey:string]:any
}
 class Actionmsg extends Component<props>{
  constructor(props:props){
    super(props)
  }
  state={
    id:"",
    data:""
 }
  componentWillMount () { }
  componentDidMount () {}
  componentWillUnmount () { }
  componentDidShow () { }
  componentDidHide () { }
  getMsg(params){
    return Taro.request({
      url: 'http://api.mn-php.top/wap/chat/list?u=2&r=',
      method:"POST",
      header: {
        'content-type': 'application/json' // 默认值
      },
      data:params
    })
  }
  onLoad(options){
      this.setState({id:options.id})
      Taro.setNavigationBarTitle({
        title:options.name
      })

     this.getMsg(
      {
        gId: 15,
        gType: options.gType,
        loading: false,
        nextId: 0,
        preId: 0,
      }
     )
  }
  onScrollToUpper() {}

  // or 使用箭头函数
  // onScrollToUpper = () => {}

  onScroll(e){
    console.log(e.detail)
  }
  render () {
    const scrollStyle = {
      height: '100%',
      background:"#eee"
    }
    const scrollTop = 0
    const Threshold = 20
    return (
      <View className='actionMsg'>
        <View className="headerMsg" catchMove>
            顶部消息
        </View>
        <View className="scrollWarp" catchMove> 
              <ScrollView
              refresherEnabled
              refresherBackground={scrollStyle.background}
              className='scrollview'
              scrollY
              scrollWithAnimation
              scrollTop={scrollTop}
              style={scrollStyle}
              lowerThreshold={Threshold}
              upperThreshold={Threshold}
              onScrollToUpper={this.onScrollToUpper.bind(this)} // 使用箭头函数的时候 可以这样写 `onScrollToUpper={this.onScrollToUpper}`
              onScroll={this.onScroll}
             >
                <View style={{width:"100%",height:"1000px"}}> {JSON.stringify(this.props.sysInfo)}</View>
               </ScrollView>
        </View>
        <View className="footerAction" catchMove>
            <View className="action">操作1</View>
            <View className="action">操作2</View>
        </View>
      </View>
    )
  }
}
const mapStateToProps = (state)=> ({
  sysInfo:state.App
})
const mapDispatchToProps = (dispatch: Dispatch) => ({
  onDecrement: () => dispatch(setData(
    {
      type:"SET",
      payload:{
        name:"fanjiantao"
      }
    }
  )),
})
export default connect(mapStateToProps)(Actionmsg)